
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <style type="text/css">
        .nianli{
            border: 2px solid red;
            display: grid;
            grid-template-columns: repeat(6, auto);
            gap: 10px;
            padding: 10px;
        }
        .title{
            color: red;
            text-align: center;
            line-height: 2;
        }
        .yueli{
            border: 1px solid blue;
            padding: 5px;
        }
        .data{
            display: grid;
            grid-template-columns: repeat(7, auto);
        }
        .data>div{

            text-align: center;
        }
        .yue{
            color:red;
            font-weight: bold;
            text-align: center;
            line-height: 2;
        }
        select{
            padding: 6px;
            width: 160px;
        }
    </style>
    <title>年历</title>
</head>
<body>
<div class='kuang'>
    <select onchange="nav(value)">
        <?php
        $d=new DateTime();
        $currentYear=$d->format('Y');
        $year=$_GET['year']??$currentYear;
        for($i=$currentYear;$i>$currentYear-10;$i--){
            echo "        <option ",$i==$year?"selected ":"","value='",$i,"'>",$i,"</option>\n";
        }
        ?>
    </select>
    <div class="title">2025年</div>
    <div class='nianli'>
        <?php
        for($i=1;$i<=12;$i++){
            echo "        <div class='yueli'>\n";
            echo "            <div class='yue'>{$i}月</div>\n";
            echo "            <div class='data'>\n";
            echo "                <div>一</div><div>二</div><div>三</div><div>四</div><div>五</div><div>六</div><div>日</div>";
            $d=new DateTime("$year-$i-1");
            $kong=$d->format('N')-1; //1号前面的空项数
            echo str_repeat('<div></div>',$kong);
            $days=$d->format('t');//这个月的天数
            for($j=1;$j<=$days;$j++){
                echo "<div>$j</div>";
            }
            echo "\n            </div>\n";
            echo "        </div>\n";
        }
        ?>

    </div>
</div>
<script>
    function nav(value){
        console.log(value) //下拉列表框当前选项的值value
        console.log(location.href) //当前正在访问的页面的网址
        location.href='?year='+value //修改当前页面的网址
    }
</script>
</body>
</html>
